<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--用户数据-->
      <el-col :span="24" :xs="24">
        <el-form :inline="true">
          <el-form-item>
            <el-select
              placeholder="请选择流程"
              clearable
              size="small"
              style="width: 240px"
              v-model="queryParams.status"
            >
              <el-option
                v-for="item in paperLevel"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>

          <!-- 重置需要改名 -->
          <el-form-item>
            <el-button icon="Refresh" size="mini" @click="ListAll"
              >重置</el-button
            >
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
    <el-table :data="viewData" style="width: 100%">
      <!-- <el-table-column
        prop="id"
        label="ID"
        align="center"
        width="100px"
        overflow:hidden
        :show-overflow-tooltip="true"
      /> -->
      <!-- <el-table-column prop="flowDefineCode" label="编码" align="center" /> -->
      <el-table-column
        prop="flowName"
        align="center"
        label="名称"
        overflow:hidden
        :show-overflow-tooltip="true"
      />
      <el-table-column
        prop="description"
        label="描述"
        align="center"
        overflow:hidden
        :show-overflow-tooltip="true"
      />
      <!-- <el-table-column
        prop="status"
        label="状态"
        align="center"
        width="100px"
      /> -->
      <el-table-column
        prop="createdTime"
        label="创建时间"
        align="center"
      />
      <el-table-column
        prop="updatedTime"
        label="更新时间"
        align="center"
      />
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template #default="scope">
          <router-link
          style="margin-right:20px"
            :to="'/system/flow-data/index/' + scope.row.id"
            class="link-type"
          >
            <span>查看流程</span>
          </router-link>
          <router-link
          
            :to="'/system/flow-assign/index/' + scope.row.flowDefineCode"
            
            class="link-type"
          >审核指派
            <span></span>
          </router-link>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      v-model:page="queryParams.pageNum"
      v-model:limit="queryParams.pageSize"
      @pagination="ListAll"
    />
  </div>
</template>

<script setup>
import { listFlow } from "@/api/system/flow";

const total = ref(0);
const viewData = ref();
const queryParams = ref({
  flowDefineCode: undefined,
  order: "DESC",
  pageNum: 1,
  pageSize: 10,
  sortBy: "id",
  status: undefined,
});

function ListAll() {
  listFlow(queryParams.value).then((res) => {
    console.log(res);
    viewData.value = res.content.map(element => {
      element.flow = JSON.parse(element.flowDefine)
      return element
    });
    console.log(viewData.value)
    total.value = res.totalElements;
  });
}
ListAll();
</script>

<style>
</style>